<template>
	<view>
        <div style="height: 44px;background-color: #fff;width:100%"></div>
		<up-navbar :safeAreaInsetTop="false" title="我的订单" :fixed="false"
			@leftClick="uni.switchTab({ url: '/pages/workbenches/workbenches' })" :title-style="{'font-size':'20px'}">

		</up-navbar>

		<div class="search_box">
			<up-search placeholder="搜索客户姓名/手机号" v-model="searchValue" shape="share" :showAction="false"
				@change="searchChange" class="seach_input"></up-search>
			<div class="search_r" @tap="openPopup">
				<image src="/static/images/search.png" alt="" style="width: 18px;
height: 18px;" />
				<div class="text-r">筛选</div>



			</div>
		</div>
		
		<ScreenPopups></ScreenPopups>
		
		<scroll-view :scroll-top="0" scroll-y="true" class="scroll-Y">
		
			<orderList :orderLists="orderLists"></orderList>

		</scroll-view>
		<!-- 订单分页 - 固定在底部 -->
		<div class="pagination-container">
		    <u-pagination :current-page="PageNumber + 1" :page-size="10" :total="total" v-if="orderLists.length > 0"
		        @current-change="handlePageChange" style="margin: 20rpx 30rpx 0;" />
		</div>
	</view>
</template>

<script setup>
import orderList from './components/orderList.vue';
import { onShow } from '@dcloudio/uni-app';
import ScreenPopups from './components/ScreenPopup.vue';
import emitter from '../../utils/eventBus';
import { ref } from 'vue';
import { getOrderList, getOrderDetail } from '../../utils/order';
const PageNumber = ref(0)
const orderLists = ref([])
const total = ref(0)
const searchValue = ref('')
const orderListHandle = async (arr) => {

	console.log(arr)
	try {
		const arr1 = []
		arr = arr.map(async (item) => {
			if (item.isAllot == '2') {
				const res = await getOrderDetail({
					orderId: item.orderId,
				})
				item.data = res.data
				console.log(item)
				arr1.push(item)
			} else {
				arr1.push(item)
			}
		})
		Promise.all(arr).then(() => {
			orderLists.value = arr1
			uni.hideLoading()
		})


	} catch (e) {
		console.log(e)
	} finally {

	}
}
const getOrderListHandle = async () => {
	uni.showLoading({
		title: '加载中...'
	})
	try {
		const res = await getOrderList({
			PageNumber: PageNumber.value + 1,
			pageSize: 10,
			businessId: uni.getStorageSync('businessId'),
		})
		console.log(res.data, 12345)
		total.value = res.data.total
		orderListHandle(res.data.records)

	} catch (e) {
		console.log(e)
	}
}

const handlePageChange = (currentPage) => {
	PageNumber.value = currentPage - 1;
	getOrderListHandle()
}

const searchNameHandle = async (name) => {
	uni.showLoading({
		title: '加载中...'
	})
	try {
		const res = await getOrderList({
			PageNumber: PageNumber.value + 1,
			pageSize: 10,
			businessId: uni.getStorageSync('businessId'),
			name: name,
		})
		total.value = res.data.total
		orderListHandle(res.data.records)
	} catch (e) {
		console.log(e)
	}
}
const searchPhoneHandle = async (phone) => {
	uni.showLoading({
		title: '加载中...'
	})
	try {
		const res = await getOrderList({
			PageNumber: PageNumber.value + 1,
			pageSize: 10,
			businessId: uni.getStorageSync('businessId'),
			phoneFirst: phone,
		})
		total.value = res.data.total
		orderListHandle(res.data.records)
	} catch (e) {
		console.log(e)
	}
}




// 防抖函数实现
const debounce = (fn, delay = 500) => {
	let timer = null;
	return function (...args) {
		if (timer) clearTimeout(timer);
		timer = setTimeout(() => {
			fn.apply(this, args);
		}, delay);
	}
};

// 添加筛选条件状态变量
const currentFilterParams = ref({});

// 原始搜索逻辑函数
const searchChangeLogic = (inputValue) => {
	searchValue.value = inputValue;
	// 构建搜索参数对象
	const searchParams = { ...currentFilterParams.value };

	if (inputValue.trim() === '') {
		// 清空搜索参数但保留筛选条件
		delete searchParams.name;
		delete searchParams.phoneFirst;
	} else {
		// 判断输入类型是手机号还是姓名
		const phoneRegex = /^1[3-9]\d{9}$/;
		if (phoneRegex.test(inputValue)) {
			searchParams.phoneFirst = inputValue;
		} else {
			searchParams.name = inputValue;
		}
	}

	// 更新当前筛选条件并触发查询
	currentFilterParams.value = searchParams;
	emitter.emit('UpdateDatas', searchParams);
};

// 应用防抖到搜索逻辑
const searchChange = debounce(searchChangeLogic, 1000);


const openPopup = () => {
	emitter.emit('openpopup')
}

const ScreenList = async (v) => {
	try {
		// 构建参数对象，合并筛选条件
		const params = {
			businessId: uni.getStorageSync('businessId'),
			pageNumber: PageNumber.value + 1,
			pageSize: 10,
			productId: v.busProId,
			college: v.school,
			classTime: v.year,
			beginTime: v.startTime,
			endTime: v.endTime,
			addPeople: v.userId,
			name: searchValue.value,
			phoneFirst: searchValue.value.leng == 11 ? searchValue.value : '',
			...v
		};
		if (v.isReturn === '是') {
			params.isReturns = 1
		} else if (v.isReturn === '否') {
			params.isReturns = 2
		} else {
			params.isReturns = ''
		}
		console.log(params, 'params')
		let res = await getOrderList(params)
		total.value = res.data.total || 0;
		orderListHandle(res.data.records)
	} catch (e) {
		console.log(e)
	}
}
emitter.on('UpdateDatas', (val) => {
	console.log(val, '筛选条件更新');
	// 保存当前筛选条件
	currentFilterParams.value = val;
	ScreenList(val);
})
emitter.on('reloadData', () => {
	getOrderListHandle()

})
onShow(() => {
	getOrderListHandle()

})
</script>

<style lang="scss">
	.scroll-Y {
		// height: 1200rpx;
		height: calc(100vh - 370rpx);
		box-sizing: border-box;
	}
.search_box {
	display: flex;
	width: 100%;
	background-color: #fff;
	align-items: center;
	padding-left: 42rpx;
	padding-right: 32rpx;
	box-sizing: border-box;
	padding-top: 20rpx;
	padding-bottom: 20rpx;
	border-bottom: 1px solid rgba(239, 239, 239, 1);
	border-top: 1px solid rgba(239, 239, 239, 1);
	;
}

.search_input {
	width: 90%;
	height: 44px;
	line-height: 22px;
	border-radius: 22px;
	background-color: rgba(255, 255, 255, 1);
	color: rgba(51, 51, 51, 1);
	font-size: 16px;
	text-align: left;
	padding-left: 20px;
	font-family: -regular;
	border: 1px solid rgba(204, 204, 204, 1);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.search_r {
	margin-left: 20rpx;
	display: flex;
	align-items: center;

	.text-r {
		line-height: 40rpx;
		color: rgba(154, 154, 154, 1);
		font-size: 28rpx;
		text-align: left;
		margin-left: 10rpx;
		font-family: PingFangSC-regular;
	}
}

page {
	// background-color: $u-bg-color;
	overflow-x: hidden;
}

/* 隐藏横向滚动条 */
::-webkit-scrollbar {
	display: none;
}

* {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.u-page {
	padding: 0;
	flex: 1;
	background-color: $u-bg-color;

	&__item {

		&__title {
			color: $u-tips-color;
			background-color: $u-bg-color;
			padding: 15px;
			font-size: 15px;

			&__slot-title {
				color: $u-primary;
				font-size: 14px;
			}
		}
	}
}

.u-nav-slot {
	@include flex;
	align-items: center;
	justify-content: space-between;
	border-width: 0.5px;
	border-radius: 100px;
	border-color: $u-border-color;
	padding: 3px 7px;
	opacity: 0.8;
}

.u-tabs__wrapper__nav {
	border-bottom: 1px solid rgba(239, 239, 239, 1);
}
</style>
